<template>
	<view class="Subscription">
		<statusBar />
		<!-- 设置 -->
		<view class="nav" @tap="leftIndex">
			<image src="../../static/setup/jiantou.png" mode=""></image>
			<view>数据-订阅管理</view>
		</view>
		<view class="search">
			<view>
				<view>今日实时</view>
				<view>最多可添加9个指标，长按可拖动排序</view>
				<!-- 排序 -->
				<shmily-drag-image :list.sync="list"></shmily-drag-image>
			</view>
			<!-- 可选指标 -->
			<view>
				<view>可选指标</view>
				<view>
					<view>下单转化率</view>
					<image src="../../static/setup/zengjia.png" mode=""></image>
				</view>
			</view>
		</view>
		
		<view class="Login">退出登录</view>
	</view>
</template>
<script>
import shmilyDragImage from '@/components/shmily-drag-image/shmily-drag-image.vue';
import { mapActions, mapState } from 'vuex';
import { toast } from '@/utils/toast';
import request from '@/utils/request';
import statusBar from '../../components/statusBar/statusBar.vue';
export default {
	data() {
		return {
			list: ['预计收入', '有效订单', '营业额', '进店转化率', '进店人数', '曝光人数']
		};
	},
	components: {
		statusBar,
		shmilyDragImage
	},
	methods: {
		leftIndex() {
			uni.navigateBack({
				delta: 1
			});
		}
	}
};
</script>
<style lang="scss" scoped>
.Subscription{
	.nav {
		display: flex;
		align-items: center;
		padding: 50upx 30upx 30upx 30upx;
		background: $bg1-color;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 9999;

		image {
			width: 27upx;
			height: 30upx;
			display: flex;
		}
		& > view {
			font-size: 34upx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			color: $bg2-color;
			margin-left: 30upx;
		}
	}
 .search {
 	// 微信小程序
 	/* #ifdef  MP-WEIXIN */

 	padding-top: 100upx;
 	/* #endif */
 	// 手机端
 	/* #ifdef APP-PLUS */
 	padding-top: 100upx;
 	/* #endif */
 	// H5端
 	/* #ifdef  H5 */
 	padding-top: 150upx;
 	/* #endif */
	&>view:nth-child(1){
		background: #FFFFFF;
		padding: 29upx 40upx 40upx 40upx;
		&>view:nth-child(1){
			font-size: 36upx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			color: #333333;
		}
		&>view:nth-child(2){

			font-size: 28upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #999999;
			margin-top: 41upx;
		}
	 }
	 &>view:nth-child(2){
		 background: #FFFFFF;
		 margin-top: 20upx;
		 padding: 30upx 50upx 30upx 50upx;
		 &>view:nth-child(1){

			 font-size: 36upx;
			 font-family: Source Han Sans CN;
			 font-weight: bold;
			 color: #333333;
		 }
		 &>view:nth-child(2){
			 width: 200upx;
			 height:96upx;
			 border: 2upx solid #BBBBBB;
			 border-radius: 10upx;
			 position: relative;
			 display: flex;
			 align-items: center;
			 justify-content: center;
			 margin-top: 40upx;
			 &>view{
				 
				 font-size: 28upx;
				 font-family: Source Han Sans CN;
				 font-weight: 400;
				 color: #666666;
			 }
			 image{
				 width: 25upx;
				 height: 25upx;
				 position: absolute;
				 top: 14upx;
				 right: 14upx;
			 }
		 }
	 }
	}
	.Login{
			   width: 93%;
			   height:112upx;
			   background:rgba(53,57,76,1);
			   border-radius:56upx;
			   font-size:34upx;
			   font-family:Source Han Sans CN;
			   font-weight:400;
			   color:$bg1-color;
			   display: flex;
			   align-items: center;
			   justify-content: center;
			   margin: 0 auto;
			   position: fixed;
			   bottom: 36upx;
			   left: 0;
			   right: 0;
			   
	}
}
</style>
